<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <link href="1.css">
    <title></title>
</head>
<body>
<header>
    <img style="float: left;width: 3rem;height: 3rem" src="img/top_back.png" >
    <img style="float: right;width: 3rem;height: 3rem" src="img/top_category.png" >
    <div style="padding: 0 3.5rem 0 3.5rem;"> <input  style="background-image:url('img/search.png');background-repeat: no-repeat;
        width: 100%; height: 3rem;border-radius: 1rem;"  type="text" placeholder="           输入你想要去的地方。"></div>

</header>
<div><img src="DJ.jpg" width="100%" height="273px"  ></div>
<div style="height: 4rem; border-top: 1px groove;border-bottom: 1px groove">
    <div style="float: left;width: 49%;text-align: center"><img src="img/jd_arr1.png">热门景点</div>
    <img src="img/line.jpg">
    <div style="float: right;width: 49%;text-align: center"><img src="img/jd_arr2.png"> 我身边</div>

</div>
<div class="title" style=" margin-top:20px;margin-left:10px"><img src="DJ1.jpg"  width="150px" height="150px"/>
    东极岛。
    <div style="float: right">票价：75</div>
</div>
<hr/>
<div class="title" style="margin-left:10px; margin-top:10px"><img src="PT.jpg"  width="150px" height="150px"/>东极岛。
    <div style="float: right">票价：75</div></div>
<hr  />
<div class="title" style="margin-left:10px; margin-top:10px"><img src="DH.jpg"  width="150px" height="150px"/> 东极岛。
    <div style="float: right">票价：75</div></div>
<hr />
<div class="title" style="margin-left:10px; margin-top:10px"><img src="TH.jpg"  width="150px" height="150px"/> 东极岛。
    <div style="float: right">票价：75</div></div>

<hr  />
<div align="center" class="body" style="margin-left:20px; margin-top:10px">

        <div style="float: left;width: 20%;text-align: center"><img src="img/jd_arr1.png">查看菜单</div>

        <div style="float: right;width: 30%;text-align: center"><img src="img/jd_arr1.png">查看景点</div>

        <div style="float: left;width: 30%;text-align: center"><img src="img/jd_arr2.png"> 查看订单</div>

        <div style="float: right;width: 20%;text-align: center"><img src="img/jd_arr2.png"> 查看天气</div>
</div>
<div></div>
<div></div>
<footer></footer>


</body>
</html>